<template>
	<view>
		<view class="list__item">
			<view class="u-flex u-flex-between">
				<view class="u-flex u-flex-y-center">
					<image :src="pro.logo" class="list__item__icon" mode="aspectFill"></image>
					<view class="list__item__title">
						<view class="list__item__title__name">
							{{pro.name}}
						</view>
						<view class="list__item__title__sh">
							适合：{{pro.method}}
						</view>
					</view>
				</view>
				<view class="list__item__status" v-if="pro.status==0">
					进行中
				</view>
				<view class="list__item__status" style="color: #a2a2a2;border-color: #a2a2a2;background-color: #f6f6f6;" v-if="pro.status==1">
					已结束
				</view>
			</view>
			<view class="list__item__table">
				<view class="list__item__table__head">
					<view class="list__item__table__head__item">
						结算标准
					</view>
					<view class="list__item__table__head__item">
						结算价格
					</view>
					<view class="list__item__table__head__item">
						结算周期
					</view>
				</view>
				<view class="list__item__table__list" v-for="(item1,index1) in pro.taskList" :key="index1">
					<view class="list__item__table__list__item">
						{{item1.name}}
					</view>
					<view class="list__item__table__list__item">
						{{item1.iPrice.toFixed(2)}}元
					</view>
					<view class="list__item__table__list__item" v-if="!item1.settleMethod">
						T+{{item1.settleTime}}
					</view>
					<view class="list__item__table__list__item" v-else>
						{{item1.settleMethod}}
					</view>
				</view>
			</view>
			<view class="list__item__sm">
				{{pro.taskList[0].note}}
			</view>
			<view class="list__item__bt" @click="navto('/pages/home/proinfo?title='+pro.name+'&id='+pro.id)">
				申请推广
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "proitem",
		props:{
			pro:{
				type: Object,
				default:{},
				notes:{}
			}
		},
		data() {
			return {
				
			};
		},
		onLoad() {
			
		}
	}
</script>

<style lang="scss">
	.list{
		&__item {
			padding: 26rpx 40rpx 28rpx;
			border-radius: 20rpx;
			background: #fff;
			margin-bottom: 20rpx;
		
			&__icon {
				width: 104rpx;
				height: 104rpx;
				margin-right: 30rpx;
				flex-shrink: 0;
				border-radius: 20rpx;
			}
		
			&__title {
				height: 70rpx;
				padding: 17rpx 0;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				flex: 1;
		
				&__name {
					font-family: SourceHanSansSC;
					font-weight: bold;
					font-size: 33rpx;
					color: #3E3D3D;
					line-height: 33rpx;
					width: 360rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
		
				&__sh {
					font-family: SourceHanSansSC;
					font-weight: 400;
					font-size: 25rpx;
					color: #989898;
					line-height: 25rpx;
				}
			}
		
			&__status {
				flex-shrink: 0;
				padding: 0 18rpx;
				line-height: 41rpx;
				background: #F1FFED;
				border-radius: 7rpx;
				border: 1px solid #4CCB2A;
				font-family: SourceHanSansSC;
				font-weight: 400;
				font-size: 25rpx;
				color: #4CCB2A;
				height: 41rpx;
			}
		
			&__table {
				margin-top: 20rpx;
				border-radius: 10rpx;
				border: 1px solid rgba(212, 227, 255, 0.6);
				overflow: hidden;
				
				&__head {
					display: flex;
					align-items: center;
					justify-content: space-between;
					font-family: SourceHanSansSC;
					font-weight: bold;
					font-size: 30rpx;
					color: #3E3D3D;
					background-color: #B8D0FF;
					&__item {
						width: 33%;
						text-align: center;
						padding:0;
						line-height: 30rpx;
						padding: 20rpx 0;
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}
		
				&__list {
					display: flex;
					align-items: center;
					justify-content: space-between;
					font-family: SourceHanSansSC;
					font-weight: 400;
					font-size: 30rpx;
					color: #3E3D3D;
					background-color: #fafafa;
					border-top: 1px solid #D4E3FF;
					&__item {
						width: 33%;
						text-align: center;
						padding: 20rpx 0;
						line-height: 34rpx;
						min-height: 50rpx;
						padding:10rpx;
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}
		
			}
		
			&__sm {
				font-family: SourceHanSansSC;
				font-weight: 400;
				font-size: 25rpx;
				color: #989898;
				line-height: 71rpx;
			}
		
			&__bt {
				width: 515rpx;
				height: 60rpx;
				background: #6492FF;
				border-radius: 30rpx;
				font-family: SourceHanSansSC;
				font-weight: 400;
				font-size: 25rpx;
				color: #F6F6F6;
				line-height: 60rpx;
				text-align: center;
				margin-left: 60rpx;
			}
		}
	}
	
</style>